<template>
    <el-drawer title="" :visible.sync="dialogVisible" direction="btt" :before-close="handleCloseDatas" size="50%" destroy-on-close>
      <el-tabs v-model="currentNameReal" class="tabs"> 
      <el-tab-pane label="评价数据" name="0" >
            <OnlineTale :search-data="searchData" :tableTitleList="tableTitleList" :tableData="newDatas" v-if="tableTitleList.length > 0 && !isComprehensive"/>
            <div style="margin-bottom:10px" v-if="isComprehensive">
              <span style="margin:0 10px 0 40px">级别</span>
              <el-select v-model="dialogLeve" placeholder="请选择" class="form-item" @change="handleChangeLevelDialog" size="small">
                <el-option label="全部" :value="0"></el-option>
                <el-option label="正常" :value="1"></el-option>
                <el-option label="轻微异常" :value="2"></el-option>
                <el-option label="一般异常" :value="3"></el-option>
                <el-option label="严重异常"  :value="4"></el-option>
              </el-select>
           </div>
            <el-table :data="newDatas" stripe v-if="newDatas.length > 0 && isComprehensive" height="calc(100vh - 600px)">  
                <el-table-column prop="indexName" label="指标名称"  align="center"></el-table-column>
                <el-table-column prop="time" label="评价日期" align="center"></el-table-column>
                <el-table-column prop="judgment" label="评价结果" align="center">
                <template slot-scope="scope">
                    <el-tag type="info" v-if="scope.row.judgment == '无'" size="small">{{ scope.row.judgment }}</el-tag>
                    <el-tag type="success" v-if="scope.row.judgment == '正常'" size="small">{{ scope.row.judgment }}</el-tag>
                    <el-tag  v-if="scope.row.judgment == '轻微异常' || scope.row.judgment == 'III级'" size="small">{{ scope.row.judgment }}</el-tag>
                    <el-tag type="warning" v-if="scope.row.judgment == '一般异常' || scope.row.judgment == 'II级'" size="small">{{ scope.row.judgment }}</el-tag>
                    <el-tag type="danger" v-if="scope.row.judgment == '严重异常' || scope.row.judgment == 'I级'" size="small">{{ scope.row.judgment }}</el-tag>
                </template>
                </el-table-column>
                <el-table-column prop="check_" label="审核状态" align="center">
                <template slot-scope="scope">
                <el-select
                        size="small"
                        style="width:120px"
                        :value="scope.row.check_"
                        @change="cellDataChange(scope.row, {key:'check'}, $event)" 
                        placeholder="请选择"
                        v-show="scope.row.check_ != null"
                    >
                    <el-option label="通过" :value=1></el-option>
                    <el-option label="未通过" :value=0></el-option>
                    </el-select>
                </template>
                </el-table-column>
                <el-table-column prop="unit" label="审核用户" align="center"></el-table-column>
            </el-table>    
        </el-tab-pane>
         <el-tab-pane label="过程线" name="1" v-if="!isComprehensive">
            <OnlineChart :search-data="drawerSearchChart"/>
         </el-tab-pane>
        <el-tab-pane label="指标控制值" name="2" v-if="!isComprehensive">
          <div class="formulaWrapper" v-if="jCriteria.length > 0">
            <p v-for="(item,index) in jCriteria" :key="index">{{ item }}</p>
          </div>
           <div class="table-wrapper">
                <controlValue :indeX_ID="searchData.indeX_ID"/>
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-drawer>
</template>
<script>
import {getCalcDescribe,indexResultList,getBottomNodeIndexSS,scuRemIndexResultCheck} from '@/api/https'
import OnlineTale from './onlineTale.vue'
import OnlineChart from './onlineChart.vue'
import controlValue from '../../base/controlValue.vue'
export default ({
    components:{OnlineTale,OnlineChart,controlValue},
    props:{
        visible:{
            type:Boolean,
            default:false
        },
        searchData:{
            type:Object,
            default:()=>{
                return {}
            }
        },
        isComprehensive:{
            type:Boolean,
            default:false
        }
        
    },
    watch: {
        visible(newVal) {
            this.dialogVisible = newVal
            if(newVal){
                this.onGetDatas()
            }
        },
        dialogVisible(newVal) {
            this.$emit('update:visible', newVal)
        }
    },
    data() {
        return {
            dialogVisible:this.visible,
            currentNameReal:'0',
            pointLineTips:[],
            pointAndLine:[],
            lineTypeList:[],
            operateFormT:{},
            newDatas:[],
            tableTitleList:[],
            pageIndex:1,
            drawerSearchChart:{},
            jCriteria:[],
            tableParamList:[],
            dialogLeve:0
        }  
    },
    beforeDestroy(){
        this.newDatas = []
        this.tableTitleList = []
        this.pageIndex = 1
        this.drawerSearchChart = {}
    },
    methods:{
        handleCloseDatas(){
            this.dialogVisible = false
            this.currentNameReal = '0'
            this.newDatas = []
            this.tableTitleList = []
            this.pageIndex = 1
            this.drawerSearchChart = {}
            this.$emit('handleCloseDatas')
        },
        onGetDatas(){
            if(this.isComprehensive){
                // 综合评价
                getBottomNodeIndexSS(this.searchData).then(res=>{
                    if(res.isSuccess){
                        this.newDatas = [...res.data]  
                    }
                })
            }else{
                // 评价数据
                indexResultList({
                    indeX_ID:this.searchData.indeX_ID,
                    begin:this.searchData.time,
                    end:this.searchData.end,
                    pageIndex:this.pageIndex,
                    PageSize:50,
                    orderType:this.searchData.orderType
                }).then(res=>{
                    if(res.isSuccess && res.data && res.data.node){
                        let tableTitleList = []
                        if(res.data.compNames.length > 0){
                            res.data.compNames.forEach((item,index)=>{
                                tableTitleList.push({
                                'title':item,
                                'value':res.data.comPs[index]
                                })
                            })
                        }
                        this.tableTitleList = tableTitleList
                        
                        let copyData = [] 
                        if(res.data.node && res.data.node.length > 0){
                            res.data.node.forEach((item,index)=>{
                                const data = {
                                    index:index+1,
                                    picktime:item.picktime, 
                                    pointName:item.pointName,
                                    check:item.check,
                                    chaeckuserName:item.chaeckuserName,
                                    id:item.id
                                }
                                if(tableTitleList.length > 0){
                                    tableTitleList.forEach((subItem,subIndex)=>{
                                        data[subItem.value] = item.comPs[subIndex]
                                    })
                                }
                                copyData.push(data)
                            })
                        }
                        this.newDatas = [...copyData]  
                        this.drawerSearchChart = {
                            begin:this.searchData.time,
                            comp:res.data.comPs,
                            compName:res.data.compNames[0],
                            end:this.searchData.end,
                            indeX_ID:this.searchData.indeX_ID,
                            statioN_ID:this.searchData.statioN_ID
                        }

                    }else{
                        this.newDatas = []
                        this.tableTitleList = []
                        this.pageIndex = 1
                        this.drawerSearchChart = {}
                    }
                })

                 // 公式
                getCalcDescribe({
                    index_CLASS_ID:this.searchData.index_CLASS_ID
                }).then(res=>{
                    if(res.isSuccess && res.data){
                        this.jCriteria = res.data.split(';')
                    }
                })
            }
        },
        handleChangeLevelDialog(val){
          this.searchData.leve = val
          // 评价数据
          getBottomNodeIndexSS(this.searchData).then(res=>{
            if(res.isSuccess){
                this.newDatas = [...res.data]  
            }
          })
        },
        cellDataChange(row, column, cellValue) {
            if(column.key == 'check'){
                scuRemIndexResultCheck({
                    ID:row.id || row.ID,
                    CHECK:cellValue,
                    STATION_ID:this.stationId
                }).then(res=>{
                    if(res.isSuccess){
                        this.$message.success('操作成功！')
                    }else{
                    this.$message.error(res.errorMessage)
                    }
                })
            }
        },
    }
})
</script>
<style scoped lang="scss">
::v-deep .smallIco{
    margin-right: 6px !important;
    font-size: 18px;
    vertical-align: middle;
}
.tabs{
    padding:0 20px;
}
::v-deep .el-drawer__header{
    margin-bottom: 0px !important;
}
</style>
